<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
request.setAttribute("contextPath",request.getContextPath());
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'error.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<style type="text/css">
		.modifyDiv{
			position:relative;
			margin-left:20px;
			display:none;
		}
	</style>
	<script type="text/javascript" src="${contextPath}/js/jquery-1.7.2.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			var nickname = /^[\w_\u0391-\uFFE5]+$/;
			var $modifyNicknameDiv = $("#modifyNicknameDiv");
			var $modifyPasswordDiv = $("#modifyPasswordDiv");
			var $nickname = $("#nickname");
			var $modifyNicknameTip = $("#modifyNicknameTip");
			var $oldPassword = $("#oldPassword");
			var $oldPasswordTip = $("#oldPasswordTip");
			var $password = $("#password");
			var $passwordTip = $("#passwordTip");
			var $passwordConfirm = $("#passwordConfirm");
			var $passwordConfirmTip = $("#passwordConfirmTip");
			var $modifyPasswordTip = $("#modifyPasswordTip");
			var $modifyNicknameSubmitButton = $("#modifyNicknameSubmitButton");
			var $modifyPasswordSubmitButton = $("#modifyPasswordSubmitButton");
			
			$("#modifyNicknameA").click(function(){
				$modifyNicknameDiv.toggle();
				return false;
			});
			
			$("#modifyPasswordA").click(function(){
				$modifyPasswordDiv.toggle();
				return false;
			});
			
			$nickname.focus(function(){
				$modifyNicknameTip.css("color","grey");
				$modifyNicknameTip.text("字母、数字、汉字或_组成");
			});
			
			$nickname.blur(function(){
				if($nickname.val().length>15){
					$modifyNicknameTip.css("color","red");
					$modifyNicknameTip.text("昵称长度应不超过15个字符");
					return;
				}
				if(!nickname.test($nickname.val())){
					$modifyNicknameTip.css("color","red");
					$modifyNicknameTip.text("请正确填写昵称");
					return;
				}
					$modifyNicknameTip.css("color","#99CC00");
					$modifyNicknameTip.text("√");
			});
			
			$modifyNicknameSubmitButton.click(function(){
				if($modifyNicknameTip.text() == "修改成功"){
					return;
				}
				if($nickname.val() == ""){
					$modifyNicknameTip.css("color","red");
					$modifyNicknameTip.text("请输入昵称");
					return;
				}
				if(!($modifyNicknameTip.text() == "√")){
					$modifyNicknameTip.css("color","red");
					$modifyNicknameTip.text("请正确填写昵称");
					return;
				}
				
				$.ajax({
					url: "${contextPath}/user/modifyNickname/"+$nickname.val(),
					type:"POST",
					success:function(o){
				 		if(o!=null && o.result == true) {
				 			$modifyNicknameTip.css("color","#99CC00");
				 			$modifyNicknameTip.text("修改成功");
				 		}else{
				 			$modifyNicknameTip.css("color","red");
							$modifyNicknameTip.text("修改失败");
				  		}
					},
					error:function(o){
						alert("error");
					}
				});	
			});
			
			$oldPassword.focus(function(){
				$modifyPasswordTip.text("");
			});
			
			$password.focus(function(){
				$modifyPasswordTip.text("");
			});
			
			$password.keyup(function(){
				var password = $password.val();
				if(password.length == 0){
					$passwordTip.text("");
					return;
				}
				if(password.length<6||password.length>15){
					$passwordTip.css("color","red");
					$passwordTip.text("密码长度应6-15");
					return;
				}
				$passwordTip.css("color","#99CC00");
				$passwordTip.text("√");
			});
			
			$password.blur(function(){
				var password = $password.val();
				var passwordConfirm = $passwordConfirm.val();
				if(password == ""){
					$passwordTip.text("");
				}
				if(passwordConfirm != "" && passwordConfirm != password ){
					$passwordConfirmTip.css("color","red");
					$passwordConfirmTip.text("两次密码不一致");
				}
				if(passwordConfirm != "" && passwordConfirm == password ){
					$passwordConfirmTip.css("color","#99CC00");
					$passwordConfirmTip.text("√");
				}
			});
			
			$passwordConfirm.focus(function(){
				$passwordConfirmTip.text("");
				$modifyPasswordTip.text("");
			});
			
			$passwordConfirm.blur(function(){
				var passwordConfirm = $passwordConfirm.val();
				var password = $password.val();
				if(passwordConfirm.length == 0){
					$passwordConfirmTip.text("");
					return;
				}
				if(passwordConfirm != password){
					$passwordConfirmTip.css("color","red");
					$passwordConfirmTip.text("两次密码不一致");
					return;
				}
				$passwordConfirmTip.css("color","#99CC00");
				$passwordConfirmTip.text("√");
			});	
			
			$modifyPasswordSubmitButton.click(function(){
				$modifyPasswordTip.text("");
				if($oldPassword.val() == ""){
					$oldPasswordTip.css("color","red");	
					$oldPasswordTip.text("请输入原密码");
				}
				if($passwordTip.text() != "√"){
					$passwordTip.css("color","red");
					$passwordTip.text("请正确填写密码");
				} 
				if($passwordConfirmTip.text() != "√"){
					$passwordConfirmTip.css("color","red");
					$passwordConfirmTip.text("请正确填写密码确认");
				}
				if($passwordTip.text() == "√" && $passwordConfirmTip.text() == "√"){
					$passwordTip.text("");
					$passwordConfirmTip.text("");
					$.ajax({
						url: "${contextPath}/user/modifyPassword?oldPassword="+$oldPassword.val()+"&password="+$password.val(),
						type:"POST",
						success:function(o){
							$oldPassword.val("");
					 		$password.val("");
					 		$passwordConfirm.val("");
					 		if(o!=null && o.result == true) {
					 			$modifyPasswordTip.css("color","#99CC00");
					 			$modifyPasswordTip.text("修改成功");
					 		}else{	
					 			$modifyPasswordTip.css("color","red");
					 			$modifyPasswordTip.text("原密码错误");
					  		}
						},
						error:function(o){
							alert("error");
						}
					});	
				};
			});
		});
	</script>
  </head>
  
  <body>
  	<a href="">首页</a>
  	<div>
   		<a id="modifyNicknameA" href="">昵称修改</a>
   	</div>
   	
   	<div id="modifyNicknameDiv" class="modifyDiv">
   		<table border="1">
   			<tr>
   				<td>新昵称</td><td><input id="nickname" name="nickname" ></td><td id="modifyNicknameTip" width="200"></td>
   			</tr>
   			<tr>
   				<td><input id="modifyNicknameSubmitButton" type="button" value="确认"></td>
   			</tr>
   		</table>
   	</div>
    
    <div>	
    	<a  id="modifyPasswordA" href="">密码修改</a>
  	</div>
  	
  	<div id="modifyPasswordDiv" class="modifyDiv">
   		<table border="1">
   			<tr>
   				<td>旧密码</td><td><input id="oldPassword" name="oldPassword" type="password"></td><td id="oldPasswordTip" width="200"></td>
   				
   			</tr>
   			<tr>	
	     		<td>新密码:</td><td><input id="password" name="password" type="password" ></td><td id="passwordTip"></td>
	     	</tr>
	     	<tr>
	     		<td>新密码确认:</td><td><input id="passwordConfirm" name="passwordConfirm" type="password"></td><td id="passwordConfirmTip"></td>
	     	</tr>
   			<tr>
   				<td><input  id="modifyPasswordSubmitButton" type="button" value="确认"></td><td></td><td id="modifyPasswordTip"></td>
   			</tr>
   		</table>
   	</div>
  	
  	<div>
  		<a href="order/checkTrolley">我的购物车</a>
  	</div>
  	
  	<div>
  		<a href="order/myOrders">我的订单</a>
  	</div>
  </body>
</html>
